<!-- 商品提审 -->
<template>
  <div style="padding: 15px 30px">
    <!-- <el-dialog title="提审" :visible.sync="dialogShow" width="65%" :close-on-click-modal="false" :close-on-press-escape="false" :show-close="false"> -->
    <template v-if="$route.query.areaType != 'car_park'">
      <div class="margin-bottom-20">
        <span class="font-size-16 font-weight-600">已拆店铺</span>
        <span>（{{ separateList.length }}）</span>
      </div>
      <el-descriptions :column="2" v-for="(item, index) in separateList" :key="index" class="border-bottom-F2F2F2 margin-bottom-10">
        <el-descriptions-item label="商铺编码">{{ item.shopCode }}</el-descriptions-item>
        <el-descriptions-item label="商铺门牌号">{{ item.shopNumber }}</el-descriptions-item>
        <el-descriptions-item label="CAD面积">{{ item.cadArea }}</el-descriptions-item>
        <el-descriptions-item label="建筑面积">{{ item.buildingArea }}</el-descriptions-item>
        <el-descriptions-item label="分摊建筑面积">{{ item.shareArea }}</el-descriptions-item>
        <el-descriptions-item label="规划用途">{{ item.dictValue }}</el-descriptions-item>
        <el-descriptions-item label="生效时间">{{ item.effectiveDate | formatDateTime('YYYY-MM-DD') }}</el-descriptions-item>
        <el-descriptions-item label="失效时间">{{ item.expirationDate | formatDateTime('YYYY-MM-DD') }}</el-descriptions-item>
      </el-descriptions>
      <div class="margin-bottom-20">
        <span class="font-size-16 font-weight-600">新增商铺</span>
      </div>
      <el-descriptions :column="2" v-for="(item, index) in approveAddList" :key="`add${index}`" class="border-bottom-F2F2F2 margin-bottom-10">
        <el-descriptions-item label="商铺编码">{{ item.shopCode }}</el-descriptions-item>
        <el-descriptions-item label="商铺门牌号">{{ item.shopNumber }}</el-descriptions-item>
        <el-descriptions-item label="CAD面积">{{ item.cadArea }}</el-descriptions-item>
        <el-descriptions-item label="建筑面积">{{ item.buildingArea }}</el-descriptions-item>
        <el-descriptions-item label="分摊建筑面积">{{ item.shareArea }}</el-descriptions-item>
        <el-descriptions-item label="规划用途">{{ item.dictValue }}</el-descriptions-item>
        <el-descriptions-item label="生效时间">{{ item.effectiveDate | formatDateTime('YYYY-MM-DD') }}</el-descriptions-item>
        <el-descriptions-item label="失效时间">{{ item.expirationDate | formatDateTime('YYYY-MM-DD') }}</el-descriptions-item>
      </el-descriptions>
    </template>

    <!-- <div class="font-weight-700 padding-bottom-15">合计XXX元，低于计划XXX元</div> -->
    <div class="align-center padding-bottom-15">
      <span class="padding-right-10" style="width: 70px">说明：</span>
      <el-input :disabled="!!$route.query.processWorkId" v-model="remark" size="mini" type="textarea" autosize></el-input>
    </div>
    <div class="flex" v-if="!$route.query.processWorkId || fileList.length">
      <p class="left-lable" style="width: 70px">文件：</p>
      <uploadFile :disabled="!!$route.query.processWorkId" :is-multiple="false" :is-margin="false" filed-name="file" :max-size="100" accept-file-type=".xlsx,.xls,.csv,.png,.jpg,.Png,.Jpg,.pdf" :file-list="fileList" file-url-name="fileUrl" file-txt-name="fileTitle" @handleSuccess="handleSuccess">
        <template v-slot:info>
          <div slot="tip" class="margin-left-10">单个文件不能超过100MB</div>
        </template>
      </uploadFile>
    </div>

    <span slot="footer" class="dialog-footer">
      <!-- <el-button v-if="$route.query.IsUpcoming" type="primary" size="mini" @click="successAudit">审批通过</el-button> -->
      <div class="t-right">
        <el-button v-if="!$route.query.processWorkId" size="mini" type="primary" @click="confirmDialog">提 审</el-button>
      </div>
      <!-- <el-button v-if="!$route.query.IsUpcoming"  size="small" type="primary" @click="hideDialog">取消</el-button> -->
    </span>

    <ApproveInfo v-if="!!$route.query.processWorkId"></ApproveInfo>
    <!-- </el-dialog> -->
  </div>
</template>
<script>
  import ApproveInfo from '../approveInfo.vue';
  import { apiShopApproveInfo } from '../../../../api/building';
  import projectInfoApi from '../../../../api/projectInfo';
  import { requestTips, askDialog } from '../../../../assets/util';
  import uploadFile from '../upload.vue';
  import { apisuccessAudit } from '../../../../api/common';
  export default {
    props: {
      // dialogShow: {
      //   type: Boolean,
      //   default: false,
      // },
      // workId: {
      //   type: String,
      //   default: '',
      // },
    },
    data() {
      return {
        approveAddList: [], //提审时新增的商铺
        separateList: [], //提审时拆分的商铺
        remark: '',
        fileList: [],
        workId: null,
      };
    },

    mounted() {
      this.workId = this.$route.query.workId;
      this.getInfo();
    },

    methods: {
      successAudit() {
        apisuccessAudit({
          floorKey: this.$route.query.floorKey,
          spaceKey: this.$route.query.spaceKey,
          systemType: this.$route.query.systemType,
          workId: this.$route.query.workId,
          workType: this.$route.query.workType,
        }).then(res => {
          if (res.success) {
            this.$message.success(res.message);
          } else this.$message.warning(res.message);
        });
      },
      //数据源
      async getInfo() {
        this.approveAddList = [];
        this.separateList = [];
        let res = await apiShopApproveInfo({
          workId: this.workId,
        });
        this.remark = res.explain;
        //0是新增 1，是拆铺，2是合铺
        res.rows.forEach(item => {
          if (item.spaceInfo.operateAction != 2) {
            this.approveAddList.push(item);
          } else {
            this.separateList.push(item);
          }
        });
        projectInfoApi.attachmentlist({ workIds: [this.workId], status: 1 }).then(res => {
          if (res.rows.length) {
            this.fileList = res.rows;
          }
        });
      },

      //提审
      confirmDialog() {
        askDialog('确认提审？', async () => {
          let data = {
            workType: 1,
            spaceKey: this.$route.query.spaceKey,
            workId: this.workId,
            remark: this.remark,
            businessAttachmentParams: this.fileList.length ? [this.fileList[0]] : null,
          };
          let res = await projectInfoApi.summitAudit(data);
          requestTips(res, () => {
            if (res.success) {
              this.$message.success(res.message);
              window.location.replace(location.href + '&processWorkId=' + this.workId);
            } else {
              this.$message.warning(res.message);
            }
          });
        });
      },

      //上传成功
      handleSuccess(file, fileList) {
        if (file.data.rows && file.data.rows.length > 0) {
          this.fileList.push({
            fileId: file.data.rows[0].key,
            fileUrl: file.data.rows[0].url,
            fileTitle: file.data.rows[0].originalName,
          });
        } else {
          this.fileList = [];
          this.$message.error(file.data.message);
        }
      },

      hideDialog() {
        this.$emit('hideDialog');
      },
    },

    components: { uploadFile, ApproveInfo },
  };
</script>
<style lang="scss" scoped>
  ::v-deep .el-upload {
    text-align: left !important;
  }
</style>
